import React from 'react'
import { MailOutlined, SettingOutlined ,AppstoreOutlined} from '@ant-design/icons';
import { useNavigate } from 'react-router-dom';
import { Menu } from 'antd';

function getItem(label, key, icon, children, type) {
  return {
    key,
    icon,
    children,
    label,
    type,
  };
}
const items = [
    getItem('首页', 'mine'),
    getItem('订单管理', '17'),
    getItem('店铺管理', 'sub1', <MailOutlined />, [
    getItem('店铺列表', '1'),
    getItem('添加店铺', '2'),
  ]),
  getItem('账号管理', 'sub2', <AppstoreOutlined />, [
    getItem('todo', 'todo'),
    getItem('home', 'home'),
    getItem('Submenu', 'sub3', null, [getItem('Option 7', '7'), getItem('Option 8', '8')]),
  ]),
  getItem('Navigation Three', 'sub4', <SettingOutlined />, [
    getItem('Option 9', '9'),
    getItem('Option 10', '10'),
    getItem('Option 11', '11'),
    getItem('Option 12', '12'),
  ]),
];
export default function Sider(e) {
    const navigate = useNavigate();
    const onClick = (e) => {
         console.log('click ', e);
        navigate('/NavPage/'+e.key)
      };
      return (
        <Menu
          onClick={onClick}
          style={{
            width: 200,
          }}
          defaultSelectedKeys={['home']}
          defaultOpenKeys={['sub2']}
          mode="inline"
          items={items}
        />
      );
}
